<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
	<title>Document</title>
	<script type="text/javascript">
		$(document).ready(function(){
			$("#btn2").click(function(){
				$("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
					if (statusTxt=="success") 
						alert("外部内容加载成功！");
					if (statusTxt=="error") 
						alert("Error: "+xhr.status+": "+xhr.statusText);
				});
			});

			$("#btn1").click(function(){
				$.get('demoTest.asp',function(data,status){
					alert("数据：" + data + "\n状态：" + status);
				});
			});

			$("#btn3").ready(function(){
				$.post("demoTestPost.asp".{
					name:"Donald Duck",
					city:"Duckburg"
				},
				function(data,status){
					alert("数据：" + data + "\n状态：" + status);
				});
			});	
		});
	</script>
</head>
<body>
	<div id="div1">
		<h2>使用 jQuery AJAX 来改变文本</h2>
	</div>
   <button id="btn2">获得外部内容</button>
   <br>

   <button id="btn1">向页面发送 HTTP GET 请求，然后获得返回的结果</button>
   <br>

   <button id="btn3">向页面发送 HTTP POST 请求，并获得返回的结果</button>
</body>
</html>